/*
 * 入库设备列表
 * @Author: LuoQianJun
 * @Date: 2018-03-31 14:53:05
 * @Last Modified by: ljb
 * @Last Modified time: 2018-09-26 18:06:58
 */
<template>
	<div class="v-admin-equipment-purchase-index">

		<Table
			:columns="columns"
			:loading="loading"
			:data="purchaseDevices"
			:height="tableHeight(0)"
			border
			class="personal-scrollbar"
			@on-sort-change="sortable"/>

	</div>
</template>

<script>

import Button from 'iview/src/components/button';
import { computedTableHeight } from 'src/views/mixins/computedTableHeight'; // 引入mixins文件

export default {

	name: 'PurchaseIndex',
	mixins: [computedTableHeight],
	props: {
		loading: {
			type: Boolean,
			default() {
				return false;
			},
		},
		purchaseDevices: {
			type: Array,
			default() {
				return [];
			},
		},
	},

	data() {
		return {
			order_bys: {
				order_by: '',
				sort: '',
			},
			columns: [
				{
					title: this.$t('equipment.code'),
					key: 'code',
					align: 'center',
					render: (h, { row }) => <div> { row.device.code || '-' } </div>,
				},
				{
					title: this.$t('equipment.device_name'),
					key: 'device_name',
					align: 'center',

					render: (h, { row }) => <div> { row.device.device_name || '-' } </div>,
				},
				{
					title: this.$t('equipment.specification'),
					key: 'specification',
					align: 'center',
					render: (h, { row }) => <div> { row.device.specification || '-' } </div>,
				},
				{
					title: this.$t('equipment.producer'),
					key: 'producer',
					align: 'center',
					render: (h, { row }) => <div> { row.device.producer || '-' } </div>,
				},
				{
					title: this.$t('equipment.buyer'),
					key: 'buyer',
					align: 'center',
					render: (h, { row }) => <div> { row.buyer || '-' } </div>,
				},
				{
					title: this.$t('equipment.stock'),
					key: 'stock',
					align: 'center',
					render: (h, { row }) => <div> { row.stock || 0 } </div>,
				},
				{
					title: this.$t('equipment.sku'),
					key: 'sku',
					width: 150,
					align: 'center',
					sortable: 'custom',
					render: (h, { row }) => <div> { row.sku || 0 } </div>,
				},
				{
					title: this.$t('equipment.purchase_at'),
					key: 'purchase_at',
					align: 'center',
					sortable: 'custom',
					width: 180,
					render: (h, { row }) => <div> { !row.purchase_at ? '-' : row.purchase_at } </div>,
				},
				{
					title: this.$t('common.operation'),
					align: 'center',
					width: 180,
					render: (h, { row }) => (
						<div>
							{
								Number(row.stock) !== 0
									? <Button size="small" style={{ marginRight: '5px' }} on-click={() => { this.$emit('showSellAdd', row); }} type="primary">{this.$t('equipment.device_on_sale')}</Button>
									: <Button size="small" style={{ marginRight: '5px' }} type="error" disabled>{this.$t('equipment.device_on_sale')}</Button>
							}

						</div>),
				},

			],
		};
	},
	methods: {
		/**
         * 排序的回调
         * @param  {Object} param {对应列的属性对象,里面包含了column列属性，key值，order排序字段}
         * @return {undefined}
         */
		sortable(param) {
			const search_param = {
				order_by: param.order === 'normal' ? '' : param.key,

				sort: param.order === 'normal' ? '' : param.order.toLocaleUpperCase(),
			};

			this.$emit('sort', search_param);
		},

	},
};
</script>
